<template>
    <div class="sp-detail" v-loading="loading">
        <div class="sp-top">
            <el-form label-width="100px" size="mini" style="width: 50%" class="demo-form-inline">
                <el-form-item label="特殊计算名称">
                    <el-input name="特殊计算名称" :disabled="isLook" v-model="specialTemplate.specialCalc.specialName" clearable></el-input>
                </el-form-item>
                <el-form-item label-width="0">
                    <el-col :span="12">
                        <el-form-item label="风控编码">
                            <el-input placeholder="自动生成" disabled v-model="specialTemplate.specialCalc.specialCode"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="恒生编码">
                            <el-input
                                name="恒生编码"
                                v-model="specialTemplate.specialCalc.hsCode"
                                :disabled="itemData.type.indexOf('add-') == -1"
                                clearable
                            ></el-input>
                        </el-form-item>
                    </el-col>
                </el-form-item>
            </el-form>
        </div>
        <div class="sp-itme">
            <ItemBranchSetting
                style="height: 380px"
                @set-branch-data="getBranchData"
                :riskEntryBranchList="riskEntryBranchList"
                :isLook="isLook"
            ></ItemBranchSetting>
        </div>
        <div class="sp-bout">
            <div class="sp-but-div">
                <el-button @click="openBranch">取消</el-button>
                <el-button v-if="!isLook" name="确定" type="primary" :disabled="loading" @click="submitSpecial">确定</el-button>
            </div>
        </div>
    </div>
</template>
<script lang="ts">
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import DictionConstUtil, { SGU_CACHE } from '@/utils/diction-const-util';
import RiskIconButton from '@/common/components/risk-icon-button.vue';
import { mixins } from 'vue-class-component';
import RiskEmitter from '@/common/mixis/risk-emitter.vue';
import ItemBranchSetting from './item-branch-setting.vue';

@Component({
    name: 'ItemSpecialDetail',
    components: {
        RiskIconButton,
        ItemBranchSetting,
    },
})
export default class ItemSpecialDetail extends mixins(RiskEmitter) {
    @Prop() itemData: any;
    specialTemplate: any = {
        specialCalc: {
            specialCode: '自动生成',
            specialName: '',
            hsCode: '',
        },
        riskEntryBranchs: [],
    };
    riskEntryBranchList: any = [];
    loading: boolean = false;
    api: string = '';
    type: string = '';
    isLook: boolean = false; // 查看

    // async mounted() {
    //     this.getspecicl();
    // }

    @Watch('itemData', { immediate: true, deep: true })
    onWatchItemData() {
        this.api = '';
        if (this.itemData.type.indexOf('special') !== -1) {
            // 特殊计算
            this.api = '/entry/template/special/';
            this.type = 'special';
        } else if (this.itemData.type.indexOf('deno') !== -1) {
            // 分母
            this.api = '/entry/template/deno/';
            this.type = 'deno';
        }

        if (this.itemData.type.indexOf('look') !== -1) {
            // 查看
            this.isLook = true;
        } else {
            this.isLook = false;
        }
        this.getspecicl();
    }

    // 获取组件数据
    getBranchData(val: any) {
        this.specialTemplate.riskEntryBranchs = val;
    }

    // 查看编辑数据
    getspecicl() {
        if (this.itemData.content) {
            this.loading = true;
            // this.$axios.get('/entry/template/special/' + this.itemData.content).then((res: any) => {
            this.$axios.get(this.api + this.itemData.content).then((res: any) => {
                this.specialTemplate.specialCalc = res.specialCalc;
                // this.specialTemplate.riskEntryBranchs = res.riskEntryBranchs;
                console.log(res);
                this.riskEntryBranchList = res.riskEntryBranchs;
                setTimeout(() => {
                    this.loading = false;
                }, 2000);
            });
        } else {
            return;
        }
    }

    // 关闭
    openBranch() {
        this.$emit('close-custom', this.itemData);
    }

    submitSpecial() {
        let a = this.handleVerifySpecial(this.specialTemplate);
        if (!a) {
            return;
        }
        let url;
        this.loading = true;

        if (this.itemData.type.indexOf('edit-') !== -1) {
            url = this.api + 'update';
        } else if (this.itemData.type.indexOf('add-') !== -1) {
            url = this.api + 'add';
        }
        // if (this.itemData.type == 'edit-special') {
        //     url = '/entry/template/special/update';
        // } else if (this.itemData.type == 'add-special') {
        //     url = '/entry/template/special/add';
        // }

        this.$axios
            .post(url, this.specialTemplate)
            .then(res => {
                this.loading = false;
                this.yh_message_success('操作成功');
                this.openBranch();
                // this.$emit('refreshData', this.type);
            })
            .catch(() => {
                this.loading = false;
            });
    }

    handleVerifySpecial(specialTemplate) {
        let text = this.type == 'special' ? '特殊计算' : '分母';

        if (!specialTemplate.specialCalc.specialName) {
            this.yh_message_error(text + '名称不能为空');

            return false;
        }
        if (!specialTemplate.specialCalc.hsCode) {
            this.yh_message_error(text + '恒生编码不能为空');
            return false;
        }
        let riskEntryBranchs = specialTemplate.riskEntryBranchs;
        if (!riskEntryBranchs || riskEntryBranchs.length === 0) {
            this.yh_message_error('分支不能为空');
            return false;
        }
        let isExistEntryBranchConfig = false;
        for (let i = 0; i < riskEntryBranchs.length; i++) {
            let entryBranchConfigs = riskEntryBranchs[i].entryBranchConfigs;
            for (let j = 0; j < entryBranchConfigs.length; j++) {
                if (entryBranchConfigs[j].boundGroupValid === false) {
                    isExistEntryBranchConfig = true;
                    break;
                }
            }
        }
        // if (!isExistEntryBranchConfig) {
        //     this.yh_message_error('至少有一个分支和证券/银行/存款相关');
        //     return false;
        // }
        return true;
    }
}
</script>
<style lang="scss" scoped>
.sp-detail {
    color: #222;
    padding: 10px;
    overflow: scroll;

    .sp-top {
        // width: calc(100vw - 20px);
        width: 100%;
        border: 1px solid #eee;
        padding: 10px;
        min-width: 1000px;
        height: 100px;
        margin-bottom: 10px;

        & /deep/ .el-form-item--mini .el-form-item__label {
            color: #222;
        }
    }

    .sp-itme {
        min-width: 1000px;
        overflow-x: hidden;
    }

    .sp-bout {
        border: 1px solid #eee;
        padding: 10px;
        height: 55px;
        min-width: 1000px;

        .sp-but-div {
            float: right;
        }
    }
}
</style>
